<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>超市订单管理系统</title>
    <link type="text/css" rel="stylesheet" href="/css/style.css"/>
    <link type="text/css" rel="stylesheet" href="/css/public.css"/>
</head>
<body>
<div>
    <!--头部-->
    <header class="publicHeader">
        <h1>超市订单管理系统</h1>
        <div class="publicHeaderR">
            <p><span>下午好！</span><span style="color: #fff21b">admin</span> , 欢迎你！</p>
            <a href="/loginOut">退出</a>
        </div>
    </header>
    <!--时间-->
    <section class="publicTime">
        <span id="time">时间</span>
        <a href="#">温馨提示：为了能正常浏览，请使用高版本浏览器！（IE10+）</a>
    </section>
</div>
<!--主体内容-->
<section class="publicMian">
    <!--左侧导航-->
    <div>
        <div th:insert="~{left :: left}"></div>
    </div>
    <!--右侧内容-->
    <div class="right">
        <div class="location">
            <strong>你现在所在的位置是:</strong>
            <span>
                <a th:href="@{/user/user}">用户管理页面</a> &gt;&gt;
                <span th:if="${null == user.id}">用户添加页面</span>
                <span th:if="${null != user.id}">用户修改页面</span>
            </span>
        </div>
        <div class="providerAdd">
            <!--th:method="${user.id==null}? 'post':'put'" form 表单不能发送put、delete等请求，-->
            <!-- 查询列表 -- GET /user、查询某个用户 -- GET /user/id 、 添加/插入 -- POST /user、 修改/更新 -- PUT/PATCH /user、 删除 -- DELETE /user/id-->
            <!--
                解决 form 不能发送 PUT/DELETE 等请求，这里以发送 PUT 请求为例：
                1、在 form 表单中的 method 属性使用 POST
             -->
            <form id="userForm" name="userForm" th:method="POST" th:action="@{/user/user}" th:object="${user}">
                <!--2、在 form 表单中增加一个 input 输入框（hidden）用来告诉springboot我们要发送什么请求（PUT、DELETE）-->
                <input type="hidden" name="_method" value="PUT" th:if="${null != user.id}" />
                <input type="hidden" name="id" th:value="*{id}">
                <!--div的class 为error是验证错误，ok是验证成功-->
                <div>
                    <label for="userCode">用户编码：</label>
                    <input type="text" name="userCode" id="userCode" th:value="*{userCode}" th:readonly="${null != user.id ? true : false}" onblur="isUserCodeExist()" />
                    <!-- 放置提示信息 -->
                    <span color="red" th:text="${null != errors ? errors['userCode'] : ''}"></span>
                </div>
                <div>
                    <label for="userName">用户名称：</label>
                    <input type="text" name="userName" id="userName"  th:value="*{userName}">
                    <!-- 放置提示信息 -->
                    <span color="red" th:text="${null != errors ? errors['userName'] : ''}"></span>
                </div>
                <div>
                    <label for="userPassword">用户密码：</label>
                    <input type="password" name="password" id="userPassword"  th:value="*{password}">
                    <!-- 放置提示信息 -->
                    <span color="red" th:text="${null != errors ? errors['password'] : ''}"></span>
                </div>
                <div>
                    <label for="ruserPassword">确认密码：</label>
                    <input type="password" name="ruserPassword" id="ruserPassword" th:value="*{password}">
                </div>
                <div>
                    <label>用户性别：</label>
                    <select name="gender" id="gender">
                        <option value="1">男</option>
                        <option value="2">女</option>
                    </select>
                    <!-- 放置提示信息 -->
                    <span color="red" th:text="${null != errors ? errors['gender'] : ''}"></span>
                </div>
                <div>
                    <label for="birthday">出生日期：</label>
                    <input type="text" class="Wdate" name="birthday" id="birthday"
                           onclick="WdatePicker();" th:value="*{birthday}">
                    <!-- 放置提示信息 -->
                    <span color="red" th:text="${null != errors ? errors['birthday'] : ''}"></span>
                </div>
                <div>
                    <label for="phone">用户电话：</label>
                    <input type="text" name="phone" id="phone" th:value="*{phone}">
                    <!-- 放置提示信息 -->
                    <span color="red" th:text="${null != errors ? errors['phone'] : ''}"></span>
                </div>
                <div>
                    <label for="address">用户地址：</label>
                    <input name="address" id="address" th:value="*{address}">
                    <!-- 放置提示信息 -->
                    <span color="red" th:text="${null != errors ? errors['address'] : ''}"></span>
                </div>
                <div>
                    <label>用户角色：</label>
                    <!-- 列出所有的角色分类 -->
                    <select name="userRole" id="userRole">
                        <option value="1">系统管理员</option>
                        <option value="2">经理</option>
                        <option value="3">普通员工</option>
                    </select>
                    <!-- 放置提示信息 -->
                    <span color="red" th:text="${null != errors ? errors['userRole'] : ''}"></span>
                </div>
                <div class="providerAddBtn">
                    <p></p>
                    <input type="submit" id="add" name="add" th:value="保存"/>
                    <input type="button" id="back" name="back" th:value="返回"/>
                </div>
            </form>
        </div>
    </div>
</section>
<div>
<footer class="footer">
    版权信息
</footer>
<script type="text/javascript" src="/js/time.js"></script>
<script type="text/javascript" src="/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="/js/common.js"></script>
<script type="text/javascript" src="/calendar/WdatePicker.js"></script>
</div>
<script type="text/javascript" src="/js/user.js"></script>
</body>
</html>